<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>产品分析--项目列表</title>
    <!--公用样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/comment.css"/>
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/supplier/common/css/style.css"/>
    <!--Layui-->
    <link rel="stylesheet" href="${re.contextPath}/plugin/layui/css/layui.css" media="all"/>
    <!--extended-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/extended.css"/>
    <!--公用样式JS-->
    <script type="text/javascript" src="${re.contextPath}/plugin/jquery/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/common/js/comment.js"></script>
    <script type="text/javascript" src="${re.contextPath}/plugin/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="${re.contextPath}/pageoffice.js" id="po_js_main"></script>
</head>
<style>
    .Right {
        width: 100%;
        overflow-y: auto;
    }
	.widthle{
		width: 35%;
	}
	.widinput{
		width: 55%!important;
	}

</style>

<body>
<!--头部-->

<!--容器-->
<div class="container clearfix"  style="margin-left:3%;width:97%;">
    <!--右侧内容-->
    <div class="Right fr mt10">
        <div class="screening screeningOne whitebg clearfix">
            <ul class="clearfix fl" style="width: 100%;">

                <li style="width: 30%;">
                    <label class="fl" style="width: 20%;" >时间段:</label>
                    <input type="text"   style="border: 1px solid #DDDDDD;width: 30%;" name="startDate" id="startDate"
                           autocomplete="off" placeholder="开始时间">
                    至
                    <input type="text"  style="border: 1px solid #DDDDDD;width: 30%;" name="endDate" id="endDate"
                           autocomplete="off" placeholder="结束时间">
                </li>
                <li style="width: 25%;">
					<label class="fl widthle">产品名称:</label>
                    <div style="display: flow-root;width: 52%;" class=" h3 fl">
                        <div class="slt" id="cpName" ></div>
                    </div>
                </li>
                <li style="width: 20%;">
                    <label class="fl widthle">品牌:</label>
                    <input type="text"  class="widinput" style="border: 1px solid #DDDDDD" name="modelName" id="modelName"
                           autocomplete="off" placeholder="填写品牌">
                </li>
                <li style="width: 20%;">
                    <label class="fl widthle">规格型号:</label>
                    <input type="text"  class="widinput" style="border: 1px solid #DDDDDD" name="xhName" id="xhName"
                           autocomplete="off" placeholder="填写规格型号">
                </li>

            </ul>
            <ul class="clearfix fl" style="width: 100%;">
                <li style="width: 100%;">
                    <div class="fr mt10">
                        <button type="button" class="layui-btn layui-btn-normal" style="width:65px; height:40px" onclick="query()">筛选</button>
                        <button type="button" class="layui-btn layui-btn-normal" style="width:65px; height:40px;background-color: #FF5722;" onclick="resetQuery()">重置</button>
                    </div>
                </li>
            </ul>

        </div>
        <div id="nowDiv">


        </div>

        <div class="project whitebg">
            <!--占位-->
            <div style=" height: 50px;margin-top: 20px;">
                <@shiro.hasPermission name="search:export">
                <input class="layui-btn layui-btn-normal layui-btn-sm fr ml10" type="button" value="导出Excel" onclick="exportTable()">
                </@shiro.hasPermission>
                <@shiro.hasPermission name="search:view">
                <input class="layui-btn layui-btn-danger layui-btn-sm fr" type="button" value="预览Excel" onclick="viewTable()">
                </@shiro.hasPermission>
            </div>
            <table id="tableList" class="layui-hide" lay-filter="tableList"></table>
        </div>
    </div>
</div>
<script type="text/javascript" src="${re.contextPath}/plugin/tools/tool.js"></script>
<script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/common/js/tabs.js"></script>
<#-- 可以多选的下拉框 -->
<script src="${re.contextPath}/plugin/layui/xm-select.js"></script>


<!-- 公共配置第三方组件 -->
<script type="text/javascript">
    layui.config({
        version: false,
        debug: false,
        base: "${re.contextPath}/plugin/layui/lay/extra/"
    })

</script>
<script type="text/javascript">
    var layer;
    var form = layui.form;
    var  autocomplete;
    var table = null;
    var tableIns = null;
    var  _xstjlcpselect;
    //注意进度条依赖 element 模块，否则无法进行正常渲染和功能性操作
    var element = "";
    layui.use('element', function () {
        element = layui.element;


    });
    layui.use('laydate', function () {
        var laydate = layui.laydate;
        //执行一个laydate实例
        laydate.render({
            elem: '#beginDate' //指定元素
        });
        laydate.render({
            elem: '#endDate' //指定元素
        });
    });


    function query() {
       var cpName= _xstjlcpselect.getValue('valueStr');
        var modelName = $('#modelName').val()
        var xhName = $('#xhName').val()
        var startDate = $('#startDate').val();
        var endDate = $('#endDate').val();
        var jsondata = {
            cpName:cpName,
            modelName:modelName,
            xhName:xhName,
            startDate: startDate,
            endDate: endDate
        };
       table.reload('tableList', {where: jsondata});
    }


    function resetQuery() {
        $('.clearfix.fl').find('input[type=text],select,input[type=number]').each(function() {
            $(this).val('');
        });
        var newv = [];
        _xstjlcpselect.setValue(newv);
        var jsondata = {
            cpName:'',
            modelName:'',
            xhName:'',
            startDate: '',
            endDate: ''
        }
        table.reload('tableList', {where: jsondata});
    }
    layui.use('laydate', function () {
        var laydate = layui.laydate;
        //执行一个laydate实例
        laydate.render({
            elem: '#startDate' //指定元素
        });
        laydate.render({
            elem: '#endDate' //指定元素
        });
    });

    layui.use(['table', 'layer', 'autocomplete'], function () {
        table = layui.table;
        element = element;
        //方法级渲染
        tableIns = table.render({
            id: 'tableList',
            elem: '#tableList',
            url: '/search/buProjectInfo/jgfxList',
            // height: "400px",
            height: "auto",
            totalRow: false,
            page: true,
            cols: [[
                {
                    title: '序号', width: '100', totalRowText: '合计',align:"center", templet: function (res) {
                        return res.LAY_INDEX;
                    }
                },
                {
                    field: 'cpName', title: '产品名称',align:"center", width: '180', sort: true
                },
                {
                    field: 'modelName', title: '品牌', align:"center",width: '130', sort: true
                },
                {
                    field: 'xhName', title: '规格/型号', align:"center",width: '130', sort: true
                },


                {field: 'num', title: '数量', width: '100', align:"center",sort: true},
                {field: 'proNum', title: '项目数量', width: '120',align:"center", sort: true, templet: function (d) {
                    return '<span class="cursor" style="color: blue;" onclick="showProDetail(\'' + d.cpName + '\',\'' + d.modelName + '\',\'' + d.xhName + '\')">' + d.proNum + '</span>';
                    }
                },
                {field: 'jsNum', title: '建设单位数量', width: '150', align:"center",sort: true,templet: function (d) {
                        return '<span class="cursor" style="color: blue;" onclick="showJsDetail(\'' + d.cpName + '\',\'' + d.modelName + '\',\'' + d.xhName + '\')">' + d.jsNum + '</span>';
                    }
                    },
                {field: 'maxNum', title: '最大值', width: '120', align:"center",sort: true,hide:true,},
                {field: 'minNum', title: '最小值', width: '120',align:"center", sort: true,hide:true,},
                {field: 'priceqj', title: '价格', width: '120',align:"center",  templet: function (d) {
                        return '<span >['+d.minNum+','+d.maxNum+']</span>';
                    }},
                { title: '最低价', width: '120', },
                { title: '最高价', width: '120', }

            ],[
                {field: 'minProjectName',align:"center", title: '项目名称', width: '120' },
                {field: 'minJsName', title: '建设单位',align:"center", width: '120'},
                {field: 'maxProjectName', title: '项目名称',align:"center", width: '120'},
                {field: 'maxJsName', title: '建设单位',align:"center", width: '120'},
            ]],
            done: function (res, currentCount) {
                //***重点***：table渲染完成后渲染element进度条
                element.render();
                merge();
                $(".layui-table-page select").css("width", "80px");

            }




        });
        // 监听排序事件
        table.on('sort(tableList)', function (obj) {
            //遍历设置目前的宽度：
            setTimeout(merge(),"500")
        });
        //监听工具条
        table.on('tool(tableList)', function (obj) {
            var data = obj.data;
            var that = $(this);
            if (obj.event === 'resetPassword') {
                parent.layer.confirm('确定重置密码？', function (index) {
                    var userId = data.userId;
                    layerAjax("resetPassword", {id: userId}, "", function (d) {
                        if (d.flag) {
                            parent.layer.close(index);
                            layer.msg("操作成功", {icon: 1});
                            tableIns.reload();
                        } else {
                            layer.msg("操作失败", {icon: 2});
                        }
                    })
                });
            }
        });

        initsl();
 /*       show();*/

    });

/*
    function show(){
        var date = new Date(); //日期对象
        var weekDay = new Array(7);
        weekDay[0] = "星期日";
        weekDay[1] = "星期一";
        weekDay[2] = "星期二";
        weekDay[3] = "星期三";
        weekDay[4] = "星期四";
        weekDay[5] = "星期五";
        weekDay[6] = "星期六";
        var now = "";
        now = date.getFullYear()+"-"; //读英文就行了
        now = now + (date.getMonth()+1)+"-"; //取月的时候取的是当前月-1如果想取当前月+1就可以了
        now = now + date.getDate()+" ";
        now = now + weekDay[date.getDay()]
        now = now + date.getHours()+":";
        now = now + date.getMinutes()+":";
        now = now + date.getSeconds()+"";
        document.getElementById("nowDiv").innerHTML = now; //div的html是now这个字符串
        setTimeout("show()",1000); //设置过1000毫秒就是1秒，调用show方法
    }
*/

    $(function () {
        //回车事件
        $(document).keydown(function(e){
            // 兼容FF和IE和Opera
            var theEvent = e || window.event;
            var code = theEvent.keyCode || theEvent.which || theEvent.charCode;
            if (code == 13) {
                query();
            }
           return true;
        });
    })

    function showJsDetail(cpName,modelName,xhName) {
        var cpName=cpName;
        var modelName=modelName;
        var xhName=xhName;
        var startDate = $('#startDate').val();
        var endDate = $('#endDate').val();
        var title = "";
        var w = "";
        var h = "";
        if (w == null || w == '') {
            w = ($(window).width()-200);
        }
        ;
        if (h == null || h == '') {
            h = ($(window).height() - 50);
        }
        var url = "/search/buProjectInfo/jgfxDetailJsDw?cpName=" + cpName+"&modelName="+modelName+"&xhName="+xhName+"&startDate="+startDate+"&endDate="+endDate;
        parent.layer.open({
            id: 'form-list',
            type: 2,
            area: [w + 'px', h + 'px'],
            fix: false,
            maxmin: true,
            shadeClose: false,
            shade: 0.4,
            title: title,
            content: url,
            success: function(layero){
                layero.find('.layui-layer-min').remove();
            }
        });



    }
    function showProDetail(cpName,modelName,xhName) {
        var cpName=cpName;
        var modelName=modelName;
        var xhName=xhName;
        var startDate = $('#startDate').val();
        var endDate = $('#endDate').val();
        var title = "";
        var w = "";
        var h = "";
        if (w == null || w == '') {
            w = ($(window).width()-200);
        }
        ;
        if (h == null || h == '') {
            h = ($(window).height() - 50);
        }
        var url = "/search/buProjectInfo/jgfxDetailPro?cpName=" + cpName+"&modelName="+modelName+"&xhName="+xhName+"&startDate="+startDate+"&endDate="+endDate;
        parent.layer.open({
            id: 'form-list',
            type: 2,
            area: [w + 'px', h + 'px'],
            fix: false,
            maxmin: true,
            shadeClose: false,
            shade: 0.4,
            title: title,
            content: url,
            success: function(layero){
                layero.find('.layui-layer-min').remove();
            }
        });


    }

    function merge() {
        $("table thead tr:first").find("th").each(function(i,v){
            if(i<10){
                $(v).attr("rowSpan","2")
            }
            if(i==10){

                $(v).attr("colSpan","2")
            }
            if(i==11){
                $(v).attr("colSpan","2")
            }
        });
        $("[data-field=\"10\"] .laytable-cell-1-0-10").css("width","100%").css("text-align","center");
        $("[data-field=\"11\"] .laytable-cell-1-0-11").css("width","100%").css("text-align","center");
        $("table tbody").find("[data-field=\"10\"]").remove();
        $("table tbody").find("[data-field=\"11\"]").remove();

    }

    function initsl() {
        layerAjaxGet("/search/buProjectInfo/getCpName?",{},"",function (d){
            var rows=null;
            if(d.flag){
                if(d.data){
                    rows=d.data;
                }
                if(rows){
                    var _ycols = ['id', 'cpName'];
                    var _gpakgs=[];
                    $.each(rows,function (i,v){
                        _gpakgs.push({name:v[_ycols[1]],value:v[_ycols[1]]});
                    })
                    _xstjlcpselect = xmSelect.render({
                        el: '#cpName',
                        name:"cpName",
                        radio: true,
                        filterable: true,
                        //layVerify: 'required',
                        // toolbar: {show: true},
                        layVerType: 'msg',
                        data: _gpakgs,
                        strict: true
                    });
                }
            }

        });
    }


    function showDetail(cpName, modelName) {
        console.log(cpName+""+modelName);
        var title = "";
        var w = "";
        var h = "";
        if (w == null || w == '') {
            w = ($(window).width()-200);
        }
        ;
        if (h == null || h == '') {
            h = ($(window).height() - 50);
        }
        var url = "/search/buProjectInfo/cpfxDetail?modelName="+modelName+"&cpName="+cpName;
        parent.layer.open({
            id: 'form-list',
            type: 2,
            area: [w + 'px', h + 'px'],
            fix: false,
            maxmin: true,
            shadeClose: false,
            shade: 0.4,
            title: title,
            content: url,
            success: function(layero){
                layero.find('.layui-layer-min').remove();
            }
        });

    }
    // 已开发票金额
    function ylfpje(id) {
        var projectId = id;
        var title = "";
        var w = "";
        var h = "";
        if (w == null || w == '') {
            w = ($(window).width()-200);
        }
        ;
        if (h == null || h == '') {
            h = ($(window).height() - 50);
        }
        var url = "/search/buProjectInfo/viewYKfP?projectId=" + projectId;
        parent.layer.open({
            id: 'form-list',
            type: 2,
            area: [w + 'px', h + 'px'],
            fix: false,
            maxmin: true,
            shadeClose: false,
            shade: 0.4,
            title: title,
            content: url,
            success: function(layero){
                layero.find('.layui-layer-min').remove();
            }
        });


    }

    function provinceChange(object) {
        var code = $(object).find('option:selected').val();
        if (code == "") {
            return;
        }
        layerAjaxGet('/sys/register/getOrganize', {"code": code}, '', function (d) {
            if (d.flag == true) {
                $(object).next().empty().append("<option value=''>选择市</option>");
                for (var i = 0; i < d.data.length; i++) {
                    $("#city").append("<option value='" + d.data[i].code + "'>" + d.data[i].name + "</option>");
                }
            } else {
                layer.msg(d.msg, {icon: 2});
            }
        });


    };

    function cityChange(object) {
        var code = $(object).find('option:selected').val();
        if (code == "") {
            return;
        }
        layerAjaxGet('/sys/register/getOrganize', {"code": code}, '', function (d) {
            if (d.flag == true) {
                $(object).next().empty().append("<option value=''>选择区县</option>");
                for (var i = 0; i < d.data.length; i++) {
                    $("#county").append("<option value='" + d.data[i].code + "'>" + d.data[i].name + "</option>");
                }
            } else {
                layer.msg(d.msg, {icon: 2});
            }
        });


    }
    //导出excel
    function exportTable(){
        var cpName= _xstjlcpselect.getValue('valueStr');
        var modelName = $('#modelName').val()
        var xhName = $('#xhName').val()
        var startDate = $('#startDate').val();
        var endDate = $('#endDate').val();
        var url= '/search/buProjectInfo/exportTable?cpName='+cpName+'&modelName='+modelName+'&xhName='+xhName+'&startDate='+startDate+'&endDate='+endDate;
        location.href = url;
    }
    //预览excel
    function viewTable(){
        var cpName= _xstjlcpselect.getValue('valueStr');
        var modelName = $('#modelName').val()
        var xhName = $('#xhName').val()
        var startDate = $('#startDate').val();
        var endDate = $('#endDate').val();
        var jsondata = {
            cpName:cpName,
            modelName:modelName,
            xhName:xhName,
            startDate: startDate,
            endDate: endDate
        };
        layerAjax('/search/buProjectInfo/viewTable', jsondata, '', function (d) {
            if(d.flag){
                if(d.data){
                    var w = ($(window).width()*0.8);
                    var h = ($(window).height()*0.8);
                    POBrowser.openWindowModeless('/sys/office/openwordTemp?ft=1&fid=' + d.data, 'width=1200px;height=800px;', '{}')
                }
            }else {
                layer.msg(d.msg, {icon: 2});
            }
            console.log(d);
        });
    }
</script>
</body>
</html>
